<!DOCTYPE html>
<html lang="zh">
  <head>
    <meta charset="utf-8" />
    <meta name="keywords" content="banyuan" />
    <meta name="description" content="程序员之家" />
    <link rel="stylesheet" href="style.css">
    <title>HTML第一课第一個</title>

    <!-- 
      快到中午了
      -->
  </head>
  <body>
    <p>第一個段落</p>
    <audio src=""></audio>
    <h1>正常情况下只会有一个H1</h1>
    <h2>这是一个二级标题</h2>
    <video controls
    width="250"
    height="200"
    muted>
    <source src="https://interactive-examples.mdn.mozilla.net/media/examples/flower.webm"
            type="video/webm">
    <source src="https://interactive-examples.mdn.mozilla.net/media/examples/flower.mp4"
            type="video/mp4">
    This browser does not support the HTML5 video element.
</video>
  <br>
    <a href="https://zhihu.com">
    <img src="../img/1.jpeg" alt="这是一些花">
    </a>
    <img src="../img/zzx.jpg" alt="蜘蛛侠" width="274px" height="184px">
    <br>
    <video muted src="./NO TIME TO DIE Trailer 4K-k2nNWZJfJiw.mp4" controls width=600></video>
    <iframe src="https://www.jd.com" frameborder="0" width="800" height="600"></iframe>
    <p>
      Lorem ipsum dolor sit amet consectetur adipisicing elit. Illo veritatis
      deleniti consectetur libero earum voluptate itaque adipisci vero, illum
      quibusdam in hic magnam, totam, repellendus ducimus quisquam dolores a
      inventore?
    </p>
    <p>abcd， &lt;p&gt;阿&nbsp;&nbsp;&nbsp;&nbsp;凡达</p>

    <em>这是强调</em>

    <strong>这是strong</strong>

    鲁迅又说<q>什么叫短引用</q>， <br />
    终于要下班了

    <blockquote>鲁迅说：这句话不是我说的。</blockquote>
    <h3>这是一个三级标题</h3>

    <a href="https://www.baidu.com" target="_blank">百度</a> <br>
    <a href="../html/hello.html">到我的hello.html文件</a><br>
    <a href="#q1">到一大段话去</a><br>
    <a href="javascript:;">去哪里呢？</a><br>
    <a href="">去哪里呢？</a>
    <h4>这是一个四级标题</h4>
    <h5>这是一个五级标题</h5>
    今天星期二 今天在下雨 中午吃什么

    <div class="box1">new box1 <q>下午的课</q></div>
    <div class="box2">new box2</div>
    <div class="box3">new box3</div>
    <div class="box4">new box4</div>

    <div class="box1">
      这是box1
      <div class="box2">
        这是box2
        <div class="box3">
          这是box3
          <div class="box4">这是box4</div>
        </div>
      </div>
    </div>

    <q id="q1">一大段话</q>
    <p>一段<span>真的</span>超长的话
      <p>第一段超长的话</p>
      <p>第二段超长的话</p>
    </p>

    <ul>
      <li>有文化</li><li>有理想</li>
      <li><span>第一点</span><span>第二啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊点 Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis veniam dolor laudantium, suscipit beatae laborum architecto aliquam delectus aspernatur ullam voluptatum excepturi ut consectetur facere quasi atque. Dolore, saepe consequatur.</span></li>
      <li></li>
    </ul>

    <dl>
      <dt>世界卫生组织</dt>
      <dt>WHO</dt>
      <dd>世界卫生组织是一个什么机构呢。。。</dd>
    </dl>

    <ol>
      <li>first</li>
      <li>second</li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
    </ol>
    
    <a href="#">到文档头部</a>
    <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Maiores in, ipsum quos nemo perspiciatis minus quae animi tenetur impedit! Quis dicta sunt, enim ut aliquam ad dolore laborum similique voluptas?
    Placeat autem quod eligendi pariatur animi doloribus ad expedita maxime quos, voluptatibus est ipsum nobis. Quos, debitis saepe minima odit eos, ut nulla consectetur aspernatur, amet hic laudantium vel dicta!
    Consectetur, sed debitis cupiditate officia impedit nobis voluptates saepe mollitia sequi deserunt laudantium esse vel animi repellendus, earum, ullam quae ducimus dolor quidem illum eum adipisci accusamus? Provident, velit soluta.
    Minus beatae cumque facere ducimus? Sit, quia, laboriosam nostrum at cum beatae modi molestiae fugiat sed voluptas vel dolorum dignissimos, provident minima fugit soluta nihil animi. Voluptatem voluptas necessitatibus voluptate.
    Provident, officia! Quia dolorum amet fugit praesentium ab quaerat ipsam repudiandae nesciunt, aliquam odit totam at ex reiciendis nam explicabo voluptas earum asperiores nulla. Suscipit aliquam ea dolorem accusamus numquam.
    Quisquam ipsam, recusandae nostrum ullam sapiente fugit explicabo quasi cumque? Odit minima id quisquam, reiciendis harum repudiandae, dolorem libero nesciunt molestiae eum vel delectus nostrum consequuntur placeat, assumenda quia natus?
    Quaerat, architecto magni a impedit iste, dolor unde itaque aperiam laudantium, error nihil consequatur sequi minus nobis autem molestiae repudiandae doloribus! Veritatis ullam consequuntur nisi neque nam possimus rem dicta?
    Voluptate culpa facere, deleniti aliquam illo labore animi esse ea adipisci porro dicta temporibus rerum, eos necessitatibus cupiditate a sit magni ducimus eius libero voluptatibus inventore. Fuga iure veritatis fugiat.
    Voluptatem assumenda commodi iure sunt cum, sed natus, dicta aut neque architecto facere hic veritatis! Temporibus voluptates iure quam, nam impedit esse, assumenda facilis similique nemo, quia fugiat excepturi reprehenderit?
    Neque nobis excepturi at fuga quis consequatur ea suscipit tempore laboriosam est sapiente molestiae dolor cum placeat alias eum delectus molestias, nam veritatis unde debitis quibusdam numquam. Blanditiis, aperiam temporibus.</p>
  </body>
</html>
